/**
 * Created by fangshufeng on 2018/4/22.
 */
import React, {Component} from 'react'
import {connect} from 'react-redux'
import {message} from 'antd'
import {Redirect} from 'react-router-dom'
import {messageMonitor} from '../redux/app.redux'

import {HeadView, FootView, BodyView} from '.'

class DashBoard extends Component {

    componentDidMount() {
        if (this.props.regist_succeed) {
            {
                this.success()
            }
             const {socket} = this.props;
            if (!socket.hasListeners('message')){
                this.props.messageMonitor();
            }
        }
    }

    success = () => {
        message.success('设备注册成功', 3);
    };

    render() {

        const {regist_succeed} = this.props;
        return regist_succeed ? <div style={style.container}>
            <div style={style.headView}><HeadView style={{height: 80}}/></div>
            <BodyView style={style.bodyView}/>
            <FootView style={style.footView}/>
        </div> : <Redirect to="/mockTool/enSelect"/>
    }
}

const style = {
    container: {
        display: 'flex',
        flexDirection: 'column',
        //todo 需要研究一下这个属性
        minHeight: '100vh'
    },
    headView: {
        flex: 1,
    },
    bodyView: {
        flex: 22,
    },
    footView: {
        flex: 1
    }
};

export default connect(state => state.app, {messageMonitor})(DashBoard);